{% extends 'myhome/index.html' %}

{% block title %}
<title>个人中心</title>
{% endblock %}

{% block css %}
<link href="/static/myhome/css/personal.css" rel="stylesheet" type="text/css">
<link href="/static/myhome/css/orstyle.css" rel="stylesheet" type="text/css">
{% endblock %}
{% block js %}
<script src="/static/myhome/AmazeUI-2.4.2/assets/js/jquery.min.js" type="text/javascript"></script>
<script src="/static/myhome/AmazeUI-2.4.2/assets/js/amazeui.js" type="text/javascript"></script>
{% endblock %}

{% block con %}
<div class="nav-table">
    <div class="long-title"><span class="all-goods">全部分类</span></div>
    <div class="nav-cont">
        <ul>
            <li class="index"><a href="{% url 'myhome_index' %}">首页</a></li>
            <li class="qc"><a href="#">闪购</a></li>
            <li class="qc"><a href="#">限时抢</a></li>
            <li class="qc"><a href="#">团购</a></li>
            <li class="qc last"><a href="#">大包装</a></li>
        </ul>
        <div class="nav-extra">
            <i class="am-icon-user-secret am-icon-md nav-user"></i><b></b>我的福利
            <i class="am-icon-angle-right" style="padding-left: 10px;"></i>
        </div>
    </div>
</div>
<b class="line"></b>
<div class="center">
    <div class="col-main">
        <div class="main-wrap">
            <div class="user-order">
                <!--标题 -->
                <div class="am-cf am-padding">
                    <div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">订单管理</strong> / <small>Order</small></div>
                </div>
                <hr>

                <div class="am-tabs am-tabs-d2 am-margin" data-am-tabs="">

                    <ul class="am-avg-sm-5 am-tabs-nav am-nav am-nav-tabs">
                        <li class="am-active"><a href="#tab1">所有订单</a></li>
                        <li class=""><a href="#tab2">待付款</a></li>
                        <li class=""><a href="#tab3">待发货</a></li>
                        <li class=""><a href="#tab4">待收货</a></li>
                        <li class=""><a href="#tab5">待评价</a></li>
                    </ul>

                    <div class="am-tabs-bd" style="touch-action: pan-y; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
                        <!-- 所有订单 -->
                        <div class="am-tab-panel am-fade am-active am-in" id="tab1">
                            <div class="order-top">
                                <div class="th th-item">
                                    商品
                                </div>
                                <div class="th th-price">
                                    单价
                                </div>
                                <div class="th th-number">
                                    数量
                                </div>
                                <div class="th th-operation">
                                    商品操作
                                </div>
                                <div class="th th-amount">
                                    合计
                                </div>
                                <div class="th th-status">
                                    交易状态
                                </div>
                                <div class="th th-change">
                                    交易操作
                                </div>
                            </div>

                            <div class="order-main">
                                <div class="order-list">
                                    {% for v in user.order_set.all %}    
                                    <!--交易成功-->
                                    <div class="order-status5">
                                        <div class="order-title">
                                            <div class="dd-num">订单编号：<a href="javascript:;">{{ v.id }}</a></div>
                                            <span>成交时间：{{ v.addtime }}</span>
                                            <!--    <em>店铺：小桔灯</em>-->
                                        </div>
                                        <div class="order-content">
                                            <div class="order-left">
                                                {% for vv in v.orderinfo_set.all %}
                                                <ul class="item-list">
                                                    <li class="td td-item">
                                                        <div class="item-pic">
                                                            <a href="#" class="J_MakePoint">
                                                                <img src="{{ vv.pic_url }}" class="itempic J_ItemImg">
                                                            </a>
                                                        </div>
                                                        <div class="item-info">
                                                            <div class="item-basic-info">
                                                                <a href="#">
                                                                    <p>{{ vv.title }}</p>
                                                                </a>
                                                            </div>
                                                        </div>
                                                    </li>
                                                    <li class="td td-price">
                                                        <div class="item-price">
                                                            {{ vv.price }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-number">
                                                        <div class="item-number">
                                                            <span>×</span>{{ vv.num }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-operation">
                                                        <div class="item-operation">
                                                        </div>
                                                    </li>
                                                </ul>
                                                {% endfor %}
                                            </div>
                                            <div class="order-right">
                                                <li class="td td-amount">
                                                    <div class="item-amount">
                                                        合计：{{ v.totalprice }}
                                                    </div>
                                                </li>
                                                <div class="move-right">
                                                    <li class="td td-status">
                                                        <div class="item-status">
                                                            <p class="Mystatus">
                                                                {% if v.status == 0 %}
                                                                    未支付
                                                                {% elif v.status == 1 %}
                                                                    已支付,待发货
                                                                    <p class="order-info"><a href="orderinfo.html">订单详情</a></p>
                                                                {% elif v.status == 2 %}
                                                                    已发货,待收货
                                                                    <p class="order-info"><a href="orderinfo.html">订单详情</a></p>
                                                                     <p class="order-info"><a href="logistics.html">查看物流</a></p>
                                                                {% elif v.status == 3 %}
                                                                    已收货,待评价
                                                                {% endif %}
                                                            </p>  
                                                        </div>
                                                    </li>
                                                    <li class="td td-change">
                                                        <div class="am-btn am-btn-danger anniu">
                                                            {% if v.status == 0 %}
                                                                一键支付
                                                            {% elif v.status == 1 %}
                                                                提醒发货
                                                            {% elif v.status == 2 %}
                                                                确认收货
                                                            {% elif v.status == 3 %}
                                                                删除订单
                                                            {% endif %}
                                                        </div>
                                                    </li>
                                                </div>
                                            </div>
                                        </div>
                                    </div>                                         
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                        <!-- 待付款 -->
                        <div class="am-tab-panel am-fade" id="tab2">
                            <div class="order-top">
                                <div class="th th-item">
                                    商品
                                </div>
                                <div class="th th-price">
                                    单价
                                </div>
                                <div class="th th-number">
                                    数量
                                </div>
                                <div class="th th-operation">
                                    商品操作
                                </div>
                                <div class="th th-amount">
                                    合计
                                </div>
                                <div class="th th-status">
                                    交易状态
                                </div>
                                <div class="th th-change">
                                    交易操作
                                </div>
                            </div>
                            <div class="order-main">
                                <div class="order-list">
                                    {% for v in user.order_set.all %}
                                    {% if v.status == 0 %}
                                    <div class="order-status1">
                                        <div class="order-title">
                                            <div class="dd-num">订单编号：<a href="javascript:;">{{ v.id }}</a></div>
                                            <span>成交时间：{{ v.addtime }}</span>
                                            <!--    <em>店铺：小桔灯</em>-->
                                        </div>
                                        <div class="order-content">
                                            <div class="order-left">
                                                {% for vv in v.orderinfo_set.all %}
                                                <ul class="item-list">
                                                    <li class="td td-item">
                                                        <div class="item-pic">
                                                            <a href="#" class="J_MakePoint">
                                                                <img src="{{ vv.pic_url }}" class="itempic J_ItemImg">
                                                            </a>
                                                        </div>
                                                        <div class="item-info">
                                                            <div class="item-basic-info">
                                                                <a href="#">
                                                                    <p>{{ vv.title }}</p>
                                                                </a>
                                                            </div>
                                                        </div>
                                                    </li>
                                                    <li class="td td-price">
                                                        <div class="item-price">
                                                            {{ vv.price }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-number">
                                                        <div class="item-number">
                                                            <span>×</span>{{ vv.num }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-operation">
                                                        <div class="item-operation">
                                                        </div>
                                                    </li>
                                                </ul>
                                                {% endfor %}
                                            </div>
                                            <div class="order-right">
                                                <li class="td td-amount">
                                                    <div class="item-amount">
                                                        合计：{{ v.totalprice }}
                                                    </div>
                                                </li>
                                                <div class="move-right">
                                                    <li class="td td-status">
                                                        <div class="item-status">
                                                            <p class="Mystatus">等待买家付款</p>
                                                            <p class="order-info"><a href="#">取消订单</a></p>

                                                        </div>
                                                    </li>
                                                    <li class="td td-change">
                                                        <a href="pay.html">
                                                        <div class="am-btn am-btn-danger anniu">
                                                            一键支付</div></a>
                                                    </li>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    {% endif %}
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                        <!-- 待发货 -->
                        <div class="am-tab-panel am-fade" id="tab3">
                            <div class="order-top">
                                <div class="th th-item">
                                    商品
                                </div>
                                <div class="th th-price">
                                    单价
                                </div>
                                <div class="th th-number">
                                    数量
                                </div>
                                <div class="th th-operation">
                                    商品操作
                                </div>
                                <div class="th th-amount">
                                    合计
                                </div>
                                <div class="th th-status">
                                    交易状态
                                </div>
                                <div class="th th-change">
                                    交易操作
                                </div>
                            </div>

                            <div class="order-main">
                                <div class="order-list">
                                    {% for v in user.order_set.all %}
                                    {% if v.status == 1 %}
                                    <div class="order-status1">
                                        <div class="order-title">
                                            <div class="dd-num">订单编号：<a href="javascript:;">{{ v.id }}</a></div>
                                            <span>成交时间：{{ v.addtime }}</span>
                                            <!--    <em>店铺：小桔灯</em>-->
                                        </div>
                                        <div class="order-content">
                                            <div class="order-left">
                                                {% for vv in v.orderinfo_set.all %}
                                                <ul class="item-list">
                                                    <li class="td td-item">
                                                        <div class="item-pic">
                                                            <a href="#" class="J_MakePoint">
                                                                <img src="{{ vv.pic_url }}" class="itempic J_ItemImg">
                                                            </a>
                                                        </div>
                                                        <div class="item-info">
                                                            <div class="item-basic-info">
                                                                <a href="#">
                                                                    <p>{{ vv.title }}</p>
                                                                </a>
                                                            </div>
                                                        </div>
                                                    </li>
                                                    <li class="td td-price">
                                                        <div class="item-price">
                                                            {{ vv.price }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-number">
                                                        <div class="item-number">
                                                            <span>×</span>{{ vv.num }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-operation">
                                                        <div class="item-operation">
                                                            <a href="refund.html">退款</a>
                                                        </div>
                                                    </li>
                                                </ul>
                                                {% endfor %}
                                            </div>
                                            <div class="order-right">
                                                <li class="td td-amount">
                                                    <div class="item-amount">
                                                        合计：{{ v.totalprice }}
                                                    </div>
                                                </li>
                                                <div class="move-right">
                                                    <li class="td td-status">
                                                        <div class="item-status">
                                                            <p class="Mystatus">买家已付款</p>
                                                            <p class="order-info"><a href="orderinfo.html">订单详情</a></p>
                                                        </div>
                                                    </li>
                                                    <li class="td td-change">
                                                        <div class="am-btn am-btn-danger anniu">
                                                            提醒发货</div>
                                                    </li>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    {% endif %}
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                        <!-- 待收货 -->
                        <div class="am-tab-panel am-fade" id="tab4">
                            <div class="order-top">
                                <div class="th th-item">
                                    商品
                                </div>
                                <div class="th th-price">
                                    单价
                                </div>
                                <div class="th th-number">
                                    数量
                                </div>
                                <div class="th th-operation">
                                    商品操作
                                </div>
                                <div class="th th-amount">
                                    合计
                                </div>
                                <div class="th th-status">
                                    交易状态
                                </div>
                                <div class="th th-change">
                                    交易操作
                                </div>
                            </div>
                            <div class="order-main">
                                <div class="order-list">
                                    {% for v in user.order_set.all %}
                                    {% if v.status == 2 %}
                                    <div class="order-status1">
                                        <div class="order-title">
                                            <div class="dd-num">订单编号：<a href="javascript:;">{{ v.id }}</a></div>
                                            <span>成交时间：{{ v.addtime }}</span>
                                            <!--    <em>店铺：小桔灯</em>-->
                                        </div>
                                        <div class="order-content">
                                            <div class="order-left">
                                                {% for vv in v.orderinfo_set.all %}
                                                <ul class="item-list">
                                                    <li class="td td-item">
                                                        <div class="item-pic">
                                                            <a href="#" class="J_MakePoint">
                                                                <img src="{{ vv.pic_url }}" class="itempic J_ItemImg">
                                                            </a>
                                                        </div>
                                                        <div class="item-info">
                                                            <div class="item-basic-info">
                                                                <a href="#">
                                                                    <p>{{ vv.title }}</p>
                                                                </a>
                                                            </div>
                                                        </div>
                                                    </li>
                                                    <li class="td td-price">
                                                        <div class="item-price">
                                                            {{ vv.price }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-number">
                                                        <div class="item-number">
                                                            <span>×</span>{{ vv.num }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-operation">
                                                        <div class="item-operation">
                                                            <a href="refund.html">退款/退货</a>
                                                        </div>
                                                    </li>
                                                </ul>
                                                {% endfor %}
                                            </div>
                                            <div class="order-right">
                                                <li class="td td-amount">
                                                    <div class="item-amount">
                                                        合计：{{ v.totalprice }}
                                                    </div>
                                                </li>
                                                <div class="move-right">
                                                    <li class="td td-status">
                                                        <div class="item-status">
                                                            <p class="Mystatus">卖家已发货</p>
                                                            <p class="order-info"><a href="orderinfo.html">订单详情</a></p>
                                                            <p class="order-info"><a href="logistics.html">查看物流</a></p>
                                                            <p class="order-info"><a href="#">延长收货</a></p>
                                                        </div>
                                                    </li>
                                                    <li class="td td-change">
                                                        <div class="am-btn am-btn-danger anniu">
                                                            确认收货</div>
                                                    </li>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    {% endif %}
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                        <!-- 待评价 -->
                        <div class="am-tab-panel am-fade" id="tab5">
                            <div class="order-top">
                                <div class="th th-item">
                                    商品
                                </div>
                                <div class="th th-price">
                                    单价
                                </div>
                                <div class="th th-number">
                                    数量
                                </div>
                                <div class="th th-operation">
                                    商品操作
                                </div>
                                <div class="th th-amount">
                                    合计
                                </div>
                                <div class="th th-status">
                                    交易状态
                                </div>
                                <div class="th th-change">
                                    交易操作
                                </div>
                            </div>

                            <div class="order-main">
                                <div class="order-list">
                                    {% for v in user.order_set.all %}
                                    {% if v.status == 3 %}
                                    <div class="order-status1">
                                        <div class="order-title">
                                            <div class="dd-num">订单编号：<a href="javascript:;">{{ v.id }}</a></div>
                                            <span>成交时间：{{ v.addtime }}</span>
                                            <!--    <em>店铺：小桔灯</em>-->
                                        </div>
                                        <div class="order-content">
                                            <div class="order-left">
                                                {% for vv in v.orderinfo_set.all %}
                                                <ul class="item-list">
                                                    <li class="td td-item">
                                                        <div class="item-pic">
                                                            <a href="#" class="J_MakePoint">
                                                                <img src="{{ vv.pic_url }}" class="itempic J_ItemImg">
                                                            </a>
                                                        </div>
                                                        <div class="item-info">
                                                            <div class="item-basic-info">
                                                                <a href="#">
                                                                    <p>{{ vv.title }}</p>
                                                                </a>
                                                            </div>
                                                        </div>
                                                    </li>
                                                    <li class="td td-price">
                                                        <div class="item-price">
                                                            {{ vv.price }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-number">
                                                        <div class="item-number">
                                                            <span>×</span>{{ vv.num }}
                                                        </div>
                                                    </li>
                                                    <li class="td td-operation">
                                                        <div class="item-operation">
                                                            <a href="refund.html">退款/退货</a>
                                                        </div>
                                                    </li>
                                                </ul>
                                                {% endfor %}
                                            </div>
                                            <div class="order-right">
                                                <li class="td td-amount">
                                                    <div class="item-amount">
                                                        合计：{{ v.totalprice }}
                                                    </div>
                                                </li>
                                                <div class="move-right">
                                                    <li class="td td-status">
                                                        <div class="item-status">
                                                            <p class="Mystatus">交易成功</p>
                                                            <p class="order-info"><a href="orderinfo.html">订单详情</a></p>
                                                            <p class="order-info"><a href="logistics.html">查看物流</a></p>
                                                        </div>
                                                    </li>
                                                    <li class="td td-change">
                                                        <a href="commentlist.html">
                                                            <div class="am-btn am-btn-danger anniu">
                                                                评价商品</div>
                                                        </a>
                                                    </li>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    {% endif %}
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--底部-->
        <div class="footer">
            <div class="footer-hd">
                <p>
                    <a href="#">恒望科技</a>
                    <b>|</b>
                    <a href="#">商城首页</a>
                    <b>|</b>
                    <a href="#">支付宝</a>
                    <b>|</b>
                    <a href="#">物流</a>
                </p>
            </div>
            <div class="footer-bd">
                <p>
                    <a href="#">关于恒望</a>
                    <a href="#">合作伙伴</a>
                    <a href="#">联系我们</a>
                    <a href="#">网站地图</a>
                    <em>© 2015-2025 Hengwang.com 版权所有</em>
                </p>
            </div>
        </div>
    </div>
    <aside class="menu">
        <ul>
            <li class="person active">
                <a href="index.html">个人中心</a>
            </li>
            <li class="person">
                <a href="#">个人资料</a>
                <ul>
                    <li> <a href="{% url 'myhome_personinfo' %}">个人信息</a></li>
                    <li> <a href="safety.html">安全设置</a></li>
                    <li> <a href="{% url 'myhome_personaddress' %}">收货地址</a></li>
                </ul>
            </li>
            <li class="person">
                <a href="#">我的交易</a>
                <ul>
                    <li><a href="{% url 'myhome_personorder' %}">订单管理</a></li>
                    <li> <a href="change.html">退款售后</a></li>
                </ul>
            </li>
            <li class="person">
                <a href="#">我的资产</a>
                <ul>
                    <li> <a href="bill.html">账单明细</a></li>
                </ul>
            </li>
        </ul>
    </aside>
</div>
{% endblock %}